<template>
  <div class="myspread">
    <!-- 头部 -->
    <div class="my_header">
      <i class="mui-icon mui-icon-arrowleft" aria-hidden="true" @click="$router.back(-1)"></i>
      <div class="top1" @click="">提成详情</div>
    </div>
    <div style="margin-top: .88rem">
      <van-cell-group>
        <van-cell :title="'昵称:'+detail.user.name" :value="'提成比例:'+detail.user.percent" :label="'级别:'+detail.user.level" />
        <!--<van-cell title="级别" :value="detail.user.level" />-->
        <!--<van-cell title="提成比例" :value="detail.user.percent" />-->
      </van-cell-group>
    </div>

    <h2 style="padding: .3rem .3rem .1rem .28rem;display: list-item">
      <p style="float: left;">交易时间</p>
      <p style="float: right">提成</p>
    </h2>
    <div v-if="detail.commission.length>0">
      <van-cell-group>
        <van-cell v-for="(item,index) in detail.commission" :key="index" :title="item.add_time" :value="item.money"/>
<!--        <van-cell title="单元格" value="内容" label="描述信息" />-->
      </van-cell-group>
    </div>
    <div v-else style="margin-top: .12rem">
      <van-cell-group>
        <van-cell value="暂时没有提成"/>
      </van-cell-group>
    </div>


  </div>
</template>

<script>
  export default {
    name: "mySpreadDetail",
    data() {
      return {
        detailId: '',
        detail:{
          user:{},
          commission:[],
        },
      };
    },
    created() {
      // localStorage.setItem('token', '734cdaf4a036863075ab51664511173a');
      this.detailId = this.$route.params.id;
      this.detailType = this.$route.params.type;
      this.getDetail();
    },
    methods: {
      getDetail() {
        $.ajax({
          type: "get",
          url: "http://zcapi.hrgsxt.cn/api/User_spread/info_pc",
          data: {
            token: localStorage.getItem("token"),
            page: 0,
            num: 10,
            s_time: "",
            e_time: "",
            level_type: this.detailType,
            user_id: this.detailId
          },
          cache: false,
          dataType: "json",
          success: response => {
            console.log('获取详情',response);
            if (response.code == 200) {
              this.detail = response.data;
            }
          }
        });
      }
    }
  }
</script>

<style scoped>
  .myspread .van-tabs__line {
    color: #0085F0 !important;
  }

  .list-content {
    overflow: scroll;
  }

  .myspread .my_header {
    width: 100%;
    height: .88rem;
    background: rgba(0, 133, 240, 1);
    text-align: center;
    color: #fff;
    line-height: .88rem;
    position: fixed;
    top: 0;
    padding: 0 .3rem;
  }

  .myspread .my_header i {
    font-size: .4rem;
    float: left;
    line-height: .88rem;
  }

  .myspread .top1 {
    display: inline-block;
  }

</style>
